{extend name='index@template/base'}{/extend}
{block name='style'}{/block}
{block name='script'}{/block}
{block name='content'}
<div class="wrapper">
    <form class="form-horizontal" id='form'  action="{:url('WechatTemplateMessage/insert')}">
        <div class="box-body">
            <div class="form-group">
                <label class="col-sm-3 control-label">模板名称</label>
                <div class="col-sm-6">
                    <input type="text" class="form-control" placeholder="模版名称，例：新品上市通知群发（自定义）" name="title">
                </div>
                <div class="col-xs-3 col-ms-3"></div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">模板编号</label>
                <div class="col-sm-6">
                    <select class="form-control" name="template_short_id" id="short_id_selector">
                        <option>-----请选择-----</option>
                        {volist name='short_id' id='vo'}
                        <option value="{$vo.tem_short_id}">{$vo.tem_short_id}({$vo.name})</option>
                        {/volist}
                    </select>
                    <!--<input type="text" class="form-control" placeholder="模版编号，例：OPENTM205213550" name="template_short_id">-->
                </div>
                <div class="col-xs-3 col-ms-3"></div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">模板ID</label>
                <div class="col-sm-6">
                    <input type="text" class="form-control" placeholder="模版消息ID，例：P8MxRKmW7wdejmZl14-swiGmsJVrFJiWYM7zKSPXq4I" name="template_id">
                </div>
                <div class="col-xs-3 col-ms-3"></div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">头部标题</label>
                <div class="col-sm-6">
                    <input type="text" class="form-control" placeholder="对填充模板 {{first.DATA}} 的值" name="first">
                </div>
                <div class="col-xs-3 col-ms-3"></div>
            </div>
            <!--<div id="type-items"></div>-->
            <!--<div class="form-group">-->
                <!--<label class="col-sm-3 control-label"></label>-->
                <!--<div class="col-sm-6">-->
                    <!--<a class="btn btn-default btn-add-type" href="javascript:;" onclick="addType();"><i class="fa fa-plus" title=""></i> 增加一条键</a>-->
                <!--</div>-->
                <!--<div class="col-xs-3 col-ms-3"></div>-->
            <!--</div>-->
            <div class="form-group">
                <label class="col-sm-3 control-label">尾部描述</label>
                <div class="col-sm-6">
                    <input type="text" class="form-control" placeholder="填充模板 {{remark.DATA}} 的值" name="remark">
                </div>
                <div class="col-xs-3 col-ms-3"></div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">消息链接</label>
                <div class="col-sm-6">
                    <input type="text" class="form-control" placeholder="链接地址" name="url">
                </div>
                <div class="col-xs-3 col-ms-3"></div>
            </div>
            <div class="form-group">
                <div class="col-sm-9 col-sm-offset-3">
                    <button type="submit" class="btn btn-primary radius">&nbsp;&nbsp;提交&nbsp;&nbsp;</button>
                    <button type="button" class="btn btn-default radius ml-20" onclick="layer_close();">&nbsp;&nbsp;取消&nbsp;&nbsp;</button>
                </div>
            </div>
        </div>
    </form>
</div>
{/block}
{block name='script_extra'}
<script>
    $("#form").Validform({
        tiptype:2,
        showAllError:true,
        ajaxPost: true,
        callback: function (res) {
            if (res.success == true){
                layer.msg(res.message, {time: 1000},function () {
                    layer_close();
                    parent.$('#table').bootstrapTable('refresh');
                });
            }
        }
    });
</script>
<script>
    var short_id=
    $('#short_id_selector').on('change',function (e) {
        short_id=$(this).val();
    });
    function addType() {
//        var html=' <div class="items">' +
//                '<div class="form-group key_item">'+
//                '<label class="col-sm-3 control-label must">自定义键</label>'+
//                '<div class="col-sm-6">'+
//                '<input type="text" name="tp_kw[]" class="form-control" value="" placeholder="键名">'+
//                '</div>'+
//                '</div>'+
//                '<div class="form-group key_item">'+
//                '<label class="col-sm-3 control-label"></label>'+
//                '<div class="col-sm-3">'+
//                '<textarea name="tp_value[]" class="form-control" placeholder="键值"></textarea>'+
//                '</div>'+
//                '<div class="col-sm-1" style="padding:0">'+
//                '<input type="color" name="tp_color[]" value="" style="width:32px;height:32px;">'+
//                '</div>'+
//                '<a class="btn btn-default" href="javascript:;" onclick=$(this).closest(".items").remove()><i class="fa fa-remove"></i> 删除</a>'+
//                '</div>'+
//                '</div>';
        var html=' <div class="items">' +
                '<div class="form-group key_item">'+
                '<label class="col-sm-3 control-label must">自定义键</label>'+
                '<div class="col-sm-6">'+
                '<input type="text" name="tp_kw[]" class="form-control" value="" placeholder="键名">'+
                '</div>'+
                '</div>'+
                '<div class="form-group key_item">'+
                '<label class="col-sm-3 control-label"></label>'+
                '<div class="col-sm-3">'+
                '<textarea name="tp_value[]" class="form-control" placeholder="键值"></textarea>'+
                '</div>'+
                '<div class="col-sm-1" style="padding:0">'+
                '<input type="color" name="tp_color[]" value="" style="width:32px;height:32px;">'+
                '</div>'+
                '<a class="btn btn-default" href="javascript:;" onclick=$(this).closest(".items").remove()><i class="fa fa-remove"></i> 删除</a>'+
                '</div>'+
                '</div>';
        $('#type-items').append(html)
    }

</script>

{/block}